// 混入:是多个页面有公共的逻辑的代码,把公共逻辑抽离出来在用混入语法导入,实现简化代码

// 导入辅助函数
import { mapGetters } from "vuex";
// 要实现tabbar购物车的徽标显示,1 当4个页面显示的时候,都要显示徽标(除了购物车为0外),2 当进入四个页面的时候对购车的数量进行操作的时候监听全局数据管理仓库的商品数量getters


export default ({
  computed: {
    ...mapGetters('cart', ['getTotalNumber'])
  },
  watch: {
    getTotalNumber () {
      this.setTabBarBridge()
    }
  },
  onShow () {
    this.setTabBarBridge()
  },
  methods: {
    // 设置tabbar中购物车徽标的方法
    // 当购物车的徽标的为0是不显示徽标
    setTabBarBridge () {
      if (this.getTotalNumber > 0) {
        // 显示徽标
        uni.setTabBarBadge({
          index: 2,
          text: `${this.getTotalNumber}`
        })
      } else {
        // 移出徽标
        uni.removeTabBarBadge({
          index: 2
        })
      }

    }
  }

})
